<template>
  <view class="my-content">
    <view class="head-content">
    	<view  class="login-content">
    		<uni-icons type="person" size="30" color="#ffffff"></uni-icons>
			<text v-if="!token" class="textinfo" @click="tologin">立即登录/注册</text>
			<text v-else class="textinfo">{{mobile}}</text>
			<view v-show="token" class="right-outbtn" @click="outlogin">
				退出登录
			</view>
    	</view>
		<view class="navigate-content">
			<view class="navi-item">
				<uni-icons type="star" size="35" color="#2abbef"></uni-icons>
				<text>我的关注</text>
			</view>
			<view class="navi-item">
				<uni-icons type="paperplane" size="35" color="#2abbef"></uni-icons>
				<text>我的发布</text>
			</view>
			<view class="navi-item">
				<uni-icons type="compose" size="35" color="#2abbef"></uni-icons>
				<text>我的订单</text>
			</view>
			<view class="navi-item">
				<uni-icons type="notification" size="35" color="#2abbef"></uni-icons>
				<text>我的预约</text>
			</view>
		</view>
    </view>
  </view>
</template>

<script>
  import {mapMutations,mapState} from 'vuex'
  
  export default {
    data() {
      return {
        // islogin:true,
		usernumber:"1242525324",
      };
    },
    computed: {
      ...mapState('m_user',['token','mobile'])
    },
	onLoad(option) {
		console.log(option,'0000')
		// this.islogin=option.islogin;
		this.usernumber=option.userphone;
	},
	methods:{
    ...mapMutations('m_user',['setToken','removeToke']),
		// 点击退出
		outlogin(){
			// this.islogin=false;
      // this.setToken('')
      this.removeToke()
		},
 
		// 点击登录,跳转登录页
		tologin(){
      uni.login({
        success: (res) => {
          // 登录
          // console.log(res,'......')
          this.logRequest(res.code)
       
        }
      })
			
		},
    async logRequest(code) {
    const res =  await uni.$http.get('/login',{code})
    // this.$store.commit('user/setToken',res.data.token)
    console.log(res.data)
    this.setToken(res.data.data.token)
    uni.navigateTo({
    	url:'/subpages/login-page/login-page'
    })
      
    }
	},
  onLoad() {
    console.log(this.token)
  }
  }
</script>

<style lang="scss" scoped>
	.my-content{
		width: 100%;
		height: 100%;
		.head-content{
			width: 100%;
			height: 360rpx;
			background-image:linear-gradient(to bottom,#2bbbef ,#78d2fa ) ;
			position: relative;
			.login-content{
				position: absolute;
				top: 40%;
				left: 40rpx;
				width: 90%;
				color: #ffffff;
				display: flex;
				align-items: center;
				.textinfo{
					margin-left: 30rpx;
					font-size: 35rpx;
				}
				.right-outbtn{
					margin-left: 22%;
					font-size: 30rpx;
					padding: 8rpx 45rpx;
					border: 1px solid #aadbf3;
					border-radius: 30rpx;
					background-color:#92dbfe ;
				}
			}
			.navigate-content{
				width: 94%;
				height: 150rpx;
				border-radius: 10rpx;
				position: absolute;
				left: 50%;
				transform: translateX(-50%);
				bottom: -75rpx;
				background-color: #ffffff;
				display: flex;
				justify-content: space-evenly;
				align-items: center;
				.navi-item{
					font-size: 30rpx;
					display: flex;
					flex-direction: column;
					align-items: center;
				}
			}
		}
	}
</style>
